<!--TODO  -->
<template>
  <div class="listPage">
    <div class="">
      <mListModuleTitle
        :titleText="this.listTitleObj.titleText"
        :showIcon="this.listTitleObj.showIcon"
        @addListItem="addListItem"
      />
      <ReagentList
        :listData="this.listData"
        :listSummaryData="this.listSummaryData"
        :listPicData="this.listPicData"
        :showUpLoad="this.showUpLoad"
        @handleDelete="handleDeleteRec"
        @handleEdit="handleEditRec"
        @handleUpShelves="handleUpShelvesRec"
        @changeShow="changeShow"
        @deleteVirusSummaryData="deleteVirusSummaryData"
        @deleteVirusPicData="deleteVirusPicData"
      />

      <div class="mPaginationBox">
        <el-pagination background layout="prev, pager, next" :total="total">
        </el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      total: 0,
      currentPage: 1,
      limit: 10,
      listData: [],
      listSummaryData: [],
      listPicData: [],
      showUpLoad: true,
      listTitleObj: {
        titleText: "真菌类生物剂列表",
        showIcon: true,
      },
    };
  },
  methods: {
    addListItem() {
      console.log("跳转到新增");
      this.$router.push({
        path: '/data/reagent/VirusAdd',
      });
    },
    handleEditRec(param) {
      this.$router.push({path:'/data/reagent/VirusEdit',query:{type:param.type,vid:param.item.recatid}});
    },
    handleUpShelvesRec(param) {
      console.log(param);
    },
    //切换生物剂
    changeShow(val) {
      if(this.listData[val.index].showDetail == true){
        this.listData[val.index].showDetail = false
      }else{
        this.listData.forEach((element) => {
          element.showDetail = false;
        });
        this.listData[val.index].showDetail = !this.listData[val.index].showDetail;
        this.getSummaryData(val.vid)
        this.getPicData(val.vid)
      }
    },
    //获取生物剂列表
    getListData() {
      this.$api.dataBA
        .regantList({
          offset: 0,
          limit: 1000,
          vir_type: "真菌类",
        })
        .then((res) => {
          console.log(res)
          this.total = res.data.count;
          res.data.data.forEach((element) => {
            element.showDetail = false;
            element.showField = false;
          });
          this.listData = res.data.data;
        });
    },
    // 获取生物剂标签列表
    getSummaryData(vid) {
      console.log(vid)
      this.$api.dataBA
        .getSummaryDataList({
          offset: 0,
          limit: 1000,
          vir_id: vid,
        })
        .then((res) => {
          console.log(res)
          this.listSummaryData = res.data.data;
        });
    },
    // 获取生物剂图片列表
    getPicData(vid) {
      this.$api.dataBA
        .getPicDataList({
          offset: 0,
          limit: 1000,
          vir_id: vid,
        })
        .then((res) => {
          console.log(res)
          this.total = res.data.count;
          res.data.data.forEach((element) => {
            element.showDetail = false;
            element.showField = false;
          });
          this.listPicData = res.data.data;
        });
    },
    //删除病毒
    handleDeleteRec(param) {
      console.log(param.item);
      if(confirm("是否要删除此生物剂?")){
        this.$api.dataBA
        .virusDelete(param.item.recatid)
        .then((res) => {
          console.log(res)
          if (res.data.statu == 0) this.getListData();
        });
      }else{
          return;
      }
    },
    //删除病毒标签
    deleteVirusSummaryData(item) {
      if(confirm("是否要删除此生物剂标签?")){
        this.$api.dataBA
        .deleteVirusSummaryData(item.id)
        .then((res) => {
          console.log(res)
          if (res.data.statu == 0) this.getListData();
        });
      }else{
          return;
      }
    },
    //删除图片案例
    deleteVirusPicData(item) {
      if(confirm("是否要删除此图片案例?")){
        this.$api.dataBA
        .deleteVirusPicData(item.id)
        .then((res) => {
          console.log(res)
          if (res.data.statu == 0) this.getListData();
        });
      }else{
          return;
      }
    },
  },
  mounted() {
    this.getListData();
  },
};
</script>
<style  scoped>
</style>